<template>
	<div>
		<sub-vue ref="sub"></sub-vue>
		<div ref="myDiv">{{text}}</div>
	</div>
</template>
<script>
	import subVue from './components/sub.vue';
	export default {
		filters: {
			myFilter(value) {
				return value.split("").reverse().join('');
			}
		},
		data() {
			return {
				text: '123456'
			};
		},
		components: {
			'subVue': subVue
		},
		//组件创建后， 数据已经完成初始化，但是dom还是生成
		created() {
			console.log('created', this.$refs.myDiv)
		},
		//数据装载，dom渲染到dom上
		mounted(){
			console.log('mounted', this.$refs.myDiv);
			//主要用来操作dom
			this.$refs.myDiv.innerHTML = "哈哈";
			//this.text = "嘻嘻呵呵";
			console.log(this.text)
			console.log('mounted', this.$refs.sub.$el);
			this.$refs.sub.$el.innerHTML = "嘻嘻";
		}
	}
</script>
<style></style>